import React from "react";
import {Form, Button, Input, Row, Col, InputNumber, message} from "antd";
import {FormItemType, FormMap, IFormItem, renderFormItem} from "@/pages/login/common";
import {apiLogin} from "@/common/apis/user-api";
import history from "@/common/history";

export const LoginForm: React.FC<any> = (props) => {

  const [form] = Form.useForm();

  const handleSubmit = async (e: { username: string; password: string }) => {
    const res = await apiLogin(e)
    if (res.code === 0) {
      message.success("登录成功");
      history.replace('/')
    } else {
      message.error('登录失败');
    }
  }

  return (
    <>
      <Form
        form={form}
        name="normal_login"
        layout={"vertical"}
        className="login-form"
        onFinish={handleSubmit}
      >

        {FormMap.map((formItem) => {
          return (
            <Row key={formItem.key}>
              <Form.Item
                key={formItem.key}
                name={formItem.key}
                label={formItem.label}
                rules={formItem.rules}
                style={{width: "100%"}}
              >
                {renderFormItem(formItem)}
              </Form.Item>
            </Row>
          );
        })}

        <Form.Item key={"submit"}>
          <Row>
            <Button type="primary" style={{width: "100%", height: 40}} htmlType="submit">
              登录
            </Button>
          </Row>
        </Form.Item>
      </Form>
    </>
  )
}

export default LoginForm;
